import React, {memo, useState} from "react";

export default function App() {
    const [name, setName] = useState("小明");
    const [title, setTitle] = useState("11111111");


    return <div>
        <button onClick={() => setName("小红")}>修改name</button>
        <button onClick={() => setTitle("22222222")}>修改title</button>
        <div>{name}</div>
        <Child titleProp={title}/>
    </div>
}

// 缓存组件 只有props更新了才会重新渲染
const Child = memo((props) => {
    return <div>
        {console.log(props)}
        我是儿子-{props.titleProp}
    </div>
});